<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>省钱约</title>
		<link rel="stylesheet" type="text/css" href="bootstrap/dist/css/bootstrap.min.css" />
		<link rel="stylesheet" type="text/css" href="css/shengqianyue.css" />
	</head>

	<body>
		<div class="top">
			<a href="#">
				<div class="logo">
					<b class="logo1">省钱约</b>
					<p class="logo2">省钱神器 领劵专用</p>
				</div>
			</a>
			<input type="search" name="搜索" id="search" placeholder="搜索你喜欢的..." />
			<input type="button" name="搜索按钮" class="search_btn" value="搜索" />
			<div class="top_r"></div>
		</div>
		<nav>
			<div class="container" style="width:1200px;padding: 0;">
				<ul class="navbar-nav">
					<li class="daohang">
						<a href="#">商城首页</a>
					</li>
					<li class="daohang">
						<a href="#">限时秒杀</a>
					</li>
					<li class="daohang">
						<a href="#">断码清仓</a>
					</li>
					<li class="daohang">
						<a href="#">9.9特卖</a>
					</li>
					<li class="daohang">
						<a href="#">每日福利</a>
					</li>
					<li class="daohang">
						<a href="#">现金签到</a>
					</li>
				</ul>
			</div>
		</nav>
		<div class="banner">
			<img src="img/1.jpg" />
			<div class="circle left">
				<</div>
					<div class="circle right">></div>
			</div>
	</body>
	<script type="text/javascript">
		var imgs = document.querySelector(".banner img");
		var left = document.querySelector(".left");
		var right = document.querySelector(".right");
		var x = 1;
		right.onclick = function() {
			x = x + 1;
			if(x > 6) {
				x = 1;
			}
			imgs.src = "img/" + x + ".jpg";
			console.log(x);
		}
		left.onclick = function() {
			x = x - 1;
			if(x < 1) {
				x = 6;
			}
			imgs.src = "img/" + x + ".jpg";
		}
		right.onclick = jia;
		left.onclick = jian;
		setInterval(jia, 1500);

		function jia() {
			x++;
			qiehuan();
		}

		function jian() {
			x--;
			qiehuan();
		}

		function qiehuan() {
			if(x > 6) {
				x = 1;
			}
			if(x < 1) {
				x = 6;
			}
			imgs.src = "img/" + x + ".jpg";
		}
	</script>

</html>